<template>
  <div>
    <h1>我是App.vue</h1>
    <!-- 我换一个模式，这里的href就要修改 -->
    <!-- <a href="#/login">登录页</a>
    <a href="#/home">首页</a> -->

    <!-- 建议用router-link跳转--声明式导航 -->
    <!-- 它的本质其实是a标签 -->
    <!-- 
      好处1：不管哪个模式都能用
          因为它会根据模式的不同，自动在路径上加#或者不加#
      好处2：能自动排他加类
          谁被点，谁会自动加两个 router-link-exact-active  router-link-active
            目前而言用哪个类都可以
     -->
    <router-link to="/login">登录页</router-link>
    <router-link to="/home">首页</router-link>

    <!-- 路由出口 -->
    <router-view />
  </div>
</template>

<script>
export default {

}
</script>

<style>
.router-link-exact-active {
  color: red;
}
</style>
